<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Window 大小和滚动</title>
	</head>
	<body>
		<script>
			// 返回窗口宽度和高度（包含滚动条）
			console.log(window.innerWidth, window.innerHeight)

			// 【常用】返回窗口内容区域的整体宽度和高度（不包含滚动条）
			console.log(document.documentElement.clientWidth)
			console.log(document.documentElement.clientHeight)

			// 获取整个窗口完整的宽高度（包含可滚动区域）
			// 为了可靠地获得完整的文档高度，我们应该采用以下这些属性的最大值。
			let scrollHeight = Math.max(
				document.body.scrollHeight,
				document.documentElement.scrollHeight,
				document.body.offsetHeight,
				document.documentElement.offsetHeight,
				document.body.clientHeight,
				document.documentElement.clientHeight
			)
			console.log(scrollHeight)
		</script>
	</body>
</html>
